<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>修改节点图标</title>
    <!-- 此文件为了显示Demo样式，项目中不需要引入 -->
    <link href="../../assets/code/demo.css" rel="stylesheet">

    <link href="http://g.alicdn.com/bui/bui/1.1.21/css/bs3/dpl.css" rel="stylesheet">
    <link href="http://g.alicdn.com/bui/bui/1.1.21/css/bs3/bui.css" rel="stylesheet">

</head>
<body>
<div class="demo-content">
    <div class="row">
        <div class="span8 offset3">
            <div id="t1">

            </div>
            <h2>点击的节点</h2>
            <div class="log well"></div>
        </div>
    </div>


    <script src="http://g.tbcdn.cn/fi/bui/jquery-1.8.1.min.js"></script>
    <script src="http://g.alicdn.com/bui/seajs/2.3.0/sea.js"></script>
    <script src="http://g.alicdn.com/bui/bui/1.1.21/config.js"></script>

    <!-- script start -->
    <script type="text/javascript">
        BUI.use('bui/tree',function (Tree) {

            var data = data && data.data || [];
            var store = new BUI.Data.TreeStore({
                pidField : 'pid', //设置pid的字段名称
                data : [
                    {id: 1, text:"one", pid: "0", leaf: false},
                    {id: 3, text:"three", pid: 1, leaf: true},
                    {id: 2, text:"two", pid: "0", leaf: true}
                ],
                root : {
                    id : '0',
                    text : '0'
                }
                // 这边是使用异步加载的方式，每次只加载一级分类，点击节点后继续加载
//                    ,url: "/admin/adminProduct/category/simpleTreeAjax",
//                    autoLoad: true
            });
            //由于这个树，不显示根节点，所以可以不指定根节点
            var tree = new BUI.Tree.TreeList({
                render : '#t1',
                width: 200,
                height: 200,
                store : store,
                showLine : true, //显示连接线
                checkType: 'all', //checkType:勾选模式，提供了4中，all,onlyLeaf,none,custom
                cascadeCheckd : false //不级联勾选
//                ,dirCls : 'icon-pkg', leafCls: 'icon-example' // 可自定义图标
            });

            tree.render();
            // 手动展开所有子节点
            for (var key in data) {
                var node = data[key]
                store.load({id: node.id, pid: node.id});
            }
        });
    </script>
    <!-- script end -->
</div>
</body>
</html>